<template>
  <div id="app">
    <router-view v-slot="{ Component }">
      <keep-alive>
        <component :is="Component" v-if="$route.meta.keepAlive" :key="$route.name" />
      </keep-alive>
      <component :is="Component" v-if="!$route.meta.keepAlive" :key="$route.name" />
    </router-view>
  </div>
</template>

<script>
import router from './router'
export default {
  name: 'App',
  created() {
    console.log('created==>>', new Date().getTime())
  },
  mounted() {
    console.log('==App==mounted==>>', new Date().getTime())
  },
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

.el-form-item--large {
  --font-size: 32px;
  display: flex;
  align-items: center;
}

.el-select--large {
  height: 64px;
  --font-size: 32px;
  /* 设置高度 */
}

.el-select__wrapper {
  min-height: 64px;
  height: 64px;
  font-size: 32px
    /* 设置高度 */
}

.el-table thead {
  color: black;
}

.el-pagination--large {
  font-size: 32px;
}

.el-pagination .btn-prev .el-icon {
  font-size: 32px;
}

.el-pagination .btn-prev .el-icon {
  font-size: 32px;
}

.el-pagination .btn-next .el-icon {
  font-size: 32px;
}
</style>
